<template>
	<view>
		<view class="userinfo">
			<view class="info">
				<view class="info-text" v-if="loginUser.nickname">
					Hi，{{loginUser.nickname}}
				</view>
				<view class="info-text" v-else> <button type="primary" @click="gotoLogin">登录</button></view>
			</view>
		</view>
		<uni-card>
			<uni-list>
				<view @click="gotoUserInfo" class="trade-info">
					<uni-list-item thumb="/static/tabbar/meactive.png" title="个人信息" showArrow></uni-list-item>
				</view>
				<view @click="gotoUserInfo" class="trade-info">
					<uni-list-item thumb="/static/tabbar/newsactive.png" title="我的记录" showArrow></uni-list-item>
				</view>
				<view @click="gotoUserInfo" class="trade-info">
					<uni-list-item thumb="/static/tabbar/guanzhuactive.png" title="我的收藏" showArrow></uni-list-item>
				</view>

				<view v-if="loginUser.nickname" @click="logout" class="trade-info">
					<uni-list-item thumb="https://www.taocheng.top/pho/static/icons/tc.png" title="退出登录"
						showArrow></uni-list-item>
				</view>
			</uni-list>
		</uni-card>

	</view>
</template>

<script>
	export default {
		name: "mine",
		data() {
			return {
				//当前用户信息
				loginUser: {},

			};
		},
		onShow() {
			this.loginUser = uni.getStorageSync('loginUser')
		},
		methods: {
			//跳转至登录页
			gotoLogin() {
				uni.navigateTo({
					url: '/pages/login/login'
				})
			},
			//跳转至个人信息页
			gotoUserInfo() {
				// 先判断当前是否登录
				if (this.loginUser.nickname) {
					uni.navigateTo({
						url: '/pages/userinfo/userinfo'
					})
				} else {
					// 提示去登录
					uni.showModal({
						title: `系统提示`,
						content: "请您先进行登录，查看更多功能！",
						showCancel: false,
						confirmText: '立即登录',
						success: function(res) {
							// 跳转到登录页面
							uni.navigateTo({
								url: `/pages/login/login`
							});

						},

					})
				}

			},
			// 退出登录
			logout() {
				// 询问用户是否退出登录
				uni.showModal({
					title: `系统提示`,
					content: "您要退出登录吗？",
					confirmText: '确定',
					success: function(res) {
						// 用户确认了退出登录的操作
						this.userinfo = {}
						getApp().globalData.loginUser = {};
						//同步清理本地数据缓存。
						try {
							uni.removeStorageSync('loginUser');
						} catch (e) {
							// error
						}
						uni.switchTab({
							url: '/pages/tabbar/index/index'
						});
					},

				})

			}
		}


	}
</script>

<style lang="scss">
	.userinfo {
		background-image: linear-gradient(#ffffff, #ccc);
		background-size: cover;
		height: 300rpx;
		width: 100%;
		display: flex;
		justify-content: center;
		align-items: center;

		.info {
			width: 300rpx;
			height: 100rpx;

			.info-text {
				font-size: 25px;
			}
		}
	}

	.trade-info {
		margin-top: 12rpx;
		margin-bottom: 10rpx;
	}
</style>